<template>
  <div>
    <Headline
        :headline1="$t('m.EquipmentCenter') + '  /  '"
        :headline2="$t('m.TimePlan')"
    />
    <a-card>
      <a-input-search
          :placeholder="$t('m.PleaseEnterYourSearchTerms')"
          style="width: 200px; margin-right: 15px"
          enter-button
          v-model="forminitial.key"
          @search="onSearch"
      />
      <a-button
          type="primary"
          @click="add"
          icon="plus"
          style="margin-right: 15px"
          v-if="isTrue('dev:time:add')"
      >{{ $t("m.Add") }}
      </a-button
      >

      <a-button
          type="primary"
          @click="edit"
          icon="edit"
          style="margin-right: 15px"
          v-if="isTrue('dev:time:update')"
      >{{ $t("m.Modification") }}
      </a-button
      >
      <a-button
          type="danger"
          @click="del"
          v-if="isTrue('dev:time:del')"
          icon="delete"
      >{{ $t("m.Delete") }}
      </a-button
      >
      <a-table
          class="ant-table-tbody"
          style="margin-top: 30px"
          :columns="columns"
          :data-source="data"
          :rowKey="(record, i) => record.timeIndex"
          bordered
          size="small"
          :pagination="false"
          :scroll="{ x: 3500, y: 500 }"
          :row-selection="{
          onChange: onSelectChange,
          selectedRowKeys: selectedRowKeysList,
        }"
      />
      <a-pagination
          style="margin-top: 10px"
          show-size-changer
          :default-current="1"
          :total="total"
          @change="Pages"
          :pageSizeOptions="['5', '10', '30', '40']"
          @showSizeChange="onShowSizeChange"
          class="pages"
      />
    </a-card>
    <a-form :form="form">
      <a-modal
          :title="$t('m.Thenewperiodoftime')"
          :visible="visible"
          @cancel="handleCancel"
          width="800px"
          @ok="handleOk"
          :cancelText="$t('m.Cancel')"
          :okText="$t('m.Ok')"
      >
        <a-form-model
            ref="ruleForm"
            :model="timeData"
            :rules="rules"
            :label-col="{ span: 6 }"
            :wrapper-col="{ span: 12 }"
        >
          <a-row>
            <a-form :form="form">
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Slotnumber')" prop="timeIndex">
                  <a-input-number
                      v-decorator="['timeIndex',{ rules: [{ required: true, message: '请输入时段编号' }] },]"
                      v-model="paramsValue.timeIndex"
                      style="width: 130px"
                  />
                </a-form-model-item>
              </a-col>

              <a-col :span="12">
                <a-form-model-item :label="$t('m.SlotName')" prop="timeName">
                  <a-input
                      v-decorator="['timeName',{ rules: [{ required: true, message: '请输入时段名称' }] },]"
                      v-model="paramsValue.timeName"
                      style="width: 130px"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod1") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTime">
                  <a-time-picker
                      v-decorator="['startTime',{ rules: [{ required: true, message: '请输入起始时间' }] },]"
                      @change="startChange1"
                      v-model="timeData.startTime"
                      :default-value="timeData.startTime"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTime">
                  <a-time-picker
                      v-decorator="['endTime',{ rules: [{ required: true, message: '请输入结束时间' }] },]"
                      @change="endChange1"
                      v-model="timeData.endTime"
                      :default-value="timeData.endTime"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod2") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt1">
                  <a-time-picker
                      @change="startChange2"
                      v-model="timeData.startTimeExt1"
                      :default-value="timeData.startTimeExt1"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt1">
                  <a-time-picker
                      @change="endChange2"
                      v-model="timeData.endTimeExt1"
                      :default-value="timeData.endTimeExt1"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod3") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt2">
                  <a-time-picker
                      @change="startChange3"
                      v-model="timeData.startTimeExt2"
                      :default-value="timeData.startTimeExt2"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt2">
                  <a-time-picker
                      @change="endChange3"
                      v-model="timeData.endTimeExt2"
                      :default-value="timeData.endTimeExt2"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod4") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt3">
                  <a-time-picker
                      @change="startChange4"
                      v-model="timeData.startTimeExt3"
                      :default-value="timeData.startTimeExt3"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt3">
                  <a-time-picker
                      @change="endChange4"
                      v-model="timeData.endTimeExt3"
                      :default-value="timeData.endTimeExt3"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod5") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt4">
                  <a-time-picker
                      @change="startChange5"
                      v-model="timeData.startTimeExt4"
                      :default-value="timeData.startTimeExt4"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt4">
                  <a-time-picker
                      @change="endChange5"
                      v-model="timeData.endTimeExt4"
                      :default-value="timeData.endTimeExt4"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod6") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt5">
                  <a-time-picker
                      @change="startChange6"
                      v-model="timeData.startTimeExt5"
                      :default-value="timeData.startTimeExt5"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt4">
                  <a-time-picker
                      @change="endChange6"
                      v-model="timeData.endTimeExt5"
                      :default-value="timeData.endTimeExt5"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod7") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt6">
                  <a-time-picker
                      @change="startChange7"
                      v-model="timeData.startTimeExt6"
                      :default-value="timeData.startTimeExt6"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt6">
                  <a-time-picker
                      @change="endChange7"
                      v-model="timeData.endTimeExt6"
                      :default-value="timeData.endTimeExt6"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod8") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt7">
                  <a-time-picker
                      @change="startChange8"
                      v-model="timeData.startTimeExt7"
                      :default-value="timeData.startTimeExt7"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt7">
                  <a-time-picker
                      @change="endChange8"
                      v-model="timeData.endTimeExt7"
                      :default-value="timeData.endTimeExt7"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod9") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt8">
                  <a-time-picker
                      @change="startChange9"
                      v-model="timeData.startTimeExt8"
                      :default-value="timeData.startTimeExt8"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt8">
                  <a-time-picker
                      @change="endChange9"
                      v-model="timeData.endTimeExt8"
                      :default-value="timeData.endTimeExt8"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod10") }}</h3>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Starts')" prop="startTimeExt9">
                  <a-time-picker
                      @change="startChange10"
                      v-model="timeData.startTimeExt9"
                      :default-value="timeData.startTimeExt9"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt9">
                  <a-time-picker
                      @change="endChange10"
                      v-model="timeData.endTimeExt9"
                      :default-value="timeData.endTimeExt9"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Passageperiod11") }}</h3>
              <a-col :span="12">
                <a-form-model-item
                    :label="$t('m.Starts')"
                    prop="startTimeExt10"
                >
                  <a-time-picker
                      @change="startChange11"
                      v-model="timeData.startTimeExt10"
                      :default-value="timeData.startTimeExt10"
                  />
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.Ends')" prop="endTimeExt10">
                  <a-time-picker
                      @change="endChange11"
                      v-model="timeData.endTimeExt10"
                      :default-value="timeData.endTimeExt10"
                  />
                </a-form-model-item>
              </a-col>
              <h3>{{ $t("m.Checkedvalid") }}</h3>
              <a-col :span="24">
                <a-form-model-item prop="type">
                  <a-checkbox-group v-model="timeData.type">
                    <a-checkbox value="1" name="type" @change="onChange1">
                      {{ $t("m.Monday") }}
                    </a-checkbox>
                    <a-checkbox value="2" name="type" @change="onChange2">
                      {{ $t("m.Tuesday") }}
                    </a-checkbox>
                    <a-checkbox value="3" name="type" @change="onChange3">
                      {{ $t("m.Wednesday") }}
                    </a-checkbox>
                    <a-checkbox value="4" name="type" @change="onChange4">
                      {{ $t("m.Thursday") }}
                    </a-checkbox>
                    <a-checkbox value="5" name="type" @change="onChange5">
                      {{ $t("m.Friday") }}
                    </a-checkbox>
                    <a-checkbox value="6" name="type" @change="onChange6">
                      {{ $t("m.Saturday") }}
                    </a-checkbox>
                    <a-checkbox value="0" name="type" @change="onChange7">
                      {{ $t("m.Sunday") }}
                    </a-checkbox>
                  </a-checkbox-group>
                </a-form-model-item>
              </a-col>
              <a-col :span="12">
                <a-form-model-item :label="$t('m.ValidDate')" prop="endDate">
                  <a-date-picker
                      v-model="timeData.endDate"
                      @change="dataChange"
                  />
                </a-form-model-item>
              </a-col>
            </a-form>
          </a-row>
        </a-form-model>
      </a-modal>
    </a-form>
    <Delete ref="delshow" @confirm="delOk" :dalete="delDataList"></Delete>
  </div>
</template>

<script>
import Headline from "@/components/Headline";
import Delete from "@/components/Delete";
import {TimeInterval} from "@/assets/js/timeInterval";
import {Setperms} from "@/assets/js/setperms";
import {
  getTimeZoneList,
  saveTimeZone,
  updateTimeZone,
  deleteTimeZone,
} from "@/api/perUnit";

export default {
  name: "Unitscheme",
  components: {Headline, Delete},
  data() {
    return {
      selectedRowKeysList: [],
      data: [],
      columns: [
        {
          title: this.$t("m.Slotnumber"),
          dataIndex: "timeIndex",
        },
        {
          title: this.$t("m.SlotName"),
          dataIndex: "timeName",
        },
        {
          title: this.$t("m.timezone1"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTime",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTime",
            },
          ],
        },
        {
          title: this.$t("m.timezone2"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt1",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt1",
            },
          ],
        },
        {
          title: this.$t("m.timezone3"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt2",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt12",
            },
          ],
        },
        {
          title: this.$t("m.timezone4"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt3",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt13",
            },
          ],
        },
        {
          title: this.$t("m.timezone5"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt4",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt4",
            },
          ],
        },
        {
          title: this.$t("m.timezone6"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt5",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt5",
            },
          ],
        },
        {
          title: this.$t("m.timezone7"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt6",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt6",
            },
          ],
        },
        {
          title: this.$t("m.timezone8"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt7",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt7",
            },
          ],
        },
        {
          title: this.$t("m.timezone9"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt8",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt8",
            },
          ],
        },
        {
          title: this.$t("m.timezone10"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt9",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt9",
            },
          ],
        },
        {
          title: this.$t("m.timezone11"),
          children: [
            {
              title: this.$t("m.Start"),
              dataIndex: "startTimeExt10",
            },
            {
              title: this.$t("m.End"),
              dataIndex: "endTimeExt10",
            },
          ],
        },
        {
          title: this.$t("m.weekValue"),
          dataIndex: "weekValue",
          width: 300,
        },
        {
          title: this.$t("m.ValidDate"),
          dataIndex: "endDate",
        },
      ],
      forminitial: {
        page: 1,
        start: 0,
        limit: 10,
        key: "",
      },
      total: 0,
      visible: false,
      form: this.$form.createForm(this, {name: "coordinated"}),
      delDataList: {
        titles: this.$t("m.DeleteThePrompt"),
        type: "warning",
        text: this.$t("m.AreYouSureToDeleteThisData"),
      },
      flag: true,
      timeData: {
        timeIndex: "",
        timeName: "",
        startTime: null,
        endTime: null,
        startTimeExt1: null,
        endTimeExt1: null,
        startTimeExt2: null,
        endTimeExt2: null,
        startTimeExt3: null,
        endTimeExt3: null,
        startTimeExt4: null,
        endTimeExt4: null,
        startTimeExt5: null,
        endTimeExt5: null,
        startTimeExt6: null,
        endTimeExt6: null,
        startTimeExt7: null,
        endTimeExt7: null,
        startTimeExt8: null,
        endTimeExt8: null,
        startTimeExt9: null,
        endTimeExt9: null,
        startTimeExt10: null,
        endTimeExt10: null,
        startTimeExt11: null,
        endTimeExt11: null,
        endDate: "2050-01-01",
        type: ["2", "1", "3", "4", "5", "6", "0"],
      },
      rules: {
        timeIndex: [
          {
            required: false,
            message: "Please input",
            trigger: "blur",
          },
        ],
        timeName: [
          {
            required: false,
            message: "Please input",
            trigger: "blur",
          },
        ],
        startTime: [
          {
            required: false,
            message: "Please input",
            trigger: "blur",
          },
        ],
        endTime: [
          {
            required: false,
            message: "Please input",
            trigger: "blur",
          },
        ],
      },
      paramsValue: {
        timeIndex: "",
        timeName: "",
        startTime: "",
        endTime: "",
        startTimeExt1: "",
        endTimeExt1: "",
        startTimeExt2: "",
        endTimeExt2: "",
        startTimeExt3: "",
        endTimeExt3: "",
        startTimeExt4: "",
        endTimeExt4: "",
        startTimeExt5: "",
        endTimeExt5: "",
        startTimeExt6: "",
        endTimeExt6: "",
        startTimeExt7: "",
        endTimeExt7: "",
        startTimeExt8: "",
        endTimeExt8: "",
        startTimeExt9: "",
        endTimeExt9: "",
        startTimeExt10: "",
        endTimeExt10: "",
        startTimeExt11: "",
        endTimeExt11: "",
        week1: 1,
        week2: 1,
        week3: 1,
        week4: 1,
        week5: 1,
        week6: 1,
        week0: 1,
        endDate: "2050-01-01",
        weekValue: "",

        // id:'',
      },
      paramsId: "",
      checkNick: false,
      form: this.$form.createForm(this, {name: "dynamic_rule"}),
    };
  },
  created() {
    this.getTimeScheme();
    this.parms = Setperms(
        this.$route.fullPath,
        JSON.parse(sessionStorage.getItem("menu"))
    );
    console.log(this.parms);
  },
  methods: {
    onChange1(e) {
      if (e.target.checked === true) {
        this.paramsValue.week1 = 1
      } else {
        this.paramsValue.week1 = 0
      }
    },
    onChange2(e) {
      if (e.target.checked === true) {
        this.paramsValue.week2 = 1
      } else {
        this.paramsValue.week2 = 0
      }
    },
    onChange3(e) {
      if (e.target.checked === true) {
        this.paramsValue.week3 = 1
      } else {
        this.paramsValue.week3 = 0
      }
    },
    onChange4(e) {
      if (e.target.checked === true) {
        this.paramsValue.week4 = 1
      } else {
        this.paramsValue.week4 = 0
      }
    },
    onChange5(e) {
      if (e.target.checked === true) {
        this.paramsValue.week5 = 1
      } else {
        this.paramsValue.week5 = 0
      }
    },
    onChange6(e) {
      if (e.target.checked === true) {
        this.paramsValue.week6 = 1
      } else {
        this.paramsValue.week6 = 0
      }
    }, onChange7(e) {
      if (e.target.checked === true) {
        this.paramsValue.week0 = 1
      } else {
        this.paramsValue.week0 = 0
      }

    },

    dataChange(e) {
      this.paramsValue.endDate = this.$moment(e._d).format("YYYY-MM-DD");
    },
    endChange1(e) {
      this.paramsValue.endTime = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange2(e) {
      this.paramsValue.endTimeExt1 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange3(e) {
      this.paramsValue.endTimeExt2 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange4(e) {
      this.paramsValue.endTimeExt3 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange5(e) {
      this.paramsValue.endTimeExt4 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange6(e) {
      this.paramsValue.endTimeExt5 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange7(e) {
      this.paramsValue.endTimeExt6 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange8(e) {
      this.paramsValue.endTimeExt7 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange9(e) {
      this.paramsValue.endTimeExt8 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange10(e) {
      this.paramsValue.endTimeExt9 = this.$moment(e._d).format("HH:mm:ss");
    },
    endChange11(e) {
      this.paramsValue.endTimeExt10 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange1(e) {
      this.paramsValue.startTime = this.$moment(e._d).format("HH:mm:ss");
      console.log(this.paramsValue);
    },
    startChange2(e) {
      console.log(e);
      this.paramsValue.startTimeExt1 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange3(e) {
      console.log(e);
      this.paramsValue.startTimeExt2 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange4(e) {
      console.log(e);
      this.paramsValue.startTimeExt3 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange5(e) {
      console.log(e);
      this.paramsValue.startTimeExt4 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange6(e) {
      console.log(e);
      this.paramsValue.startTimeExt5 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange7(e) {
      this.paramsValue.startTimeExt6 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange8(e) {
      this.paramsValue.startTimeExt7 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange9(e) {
      this.paramsValue.startTimeExt8 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange10(e) {
      this.paramsValue.startTimeExt9 = this.$moment(e._d).format("HH:mm:ss");
    },
    startChange11(e) {
      this.paramsValue.startTimeExt10 = this.$moment(e._d).format("HH:mm:ss");
    },
    handleOk() {
      this.form.validateFields(err => {
        if (!err) {
          this.form.resetFields();
          console.info('success');
        }
      });
        if (this.paramsValue.timeIndex == "" && this.paramsValue.timeName == "" && this.paramsValue.timeIndex == '' && this.paramsValue.timeName == '') {
          console.log("没有通过校验");
          this.visible = true;
        } else {
          let statuFlag = TimeInterval(this.paramsValue);
          if (statuFlag == true) {
            if (this.flag == true) {
              saveTimeZone(this.paramsValue)
                  .then((res) => {
                    if (res.data.success == true) {
                      this.$message.success("添加成功");
                      this.getTimeScheme();
                    }
                    if (res.data.success == false) {
                      this.$message.warning(res.data.msg);
                    }
                  })
                  .catch((err) => {
                    this.$message.error("操作失败");
                  });
            }
            if (this.flag == false) {
              this.paramsValue.weekValue = "{\"w0\": "+ this.paramsValue.week0 + " ,\"w1\": " + this.paramsValue.week1 + " ,\"w2\": " + this.paramsValue.week2 + " ,\"w3\": " + this.paramsValue.week3 + ",\"w4\": " + this.paramsValue.week4 + ",\"w5\": " + this.paramsValue.week5 + " ,\"w6\": " + this.paramsValue.week6 + "}"
              let demo = JSON.parse(JSON.stringify(this.paramsValue));
              demo.id = this.paramsId;
              this.paramsValue
              console.log(demo);
              updateTimeZone(demo)
                  .then((res) => {
                    if (res.data.success == true) {
                      this.$message.success("修改成功");
                      this.getTimeScheme();
                    }
                    if (res.data.success == false) {
                      this.$message.warning(res.data.msg);
                    }
                  })
                  .catch((err) => {
                    this.$message.error("操作失败");
                    console.log(err);
                  });
            }
            this.visible = false;
            this.timeData.startTime = null;
            this.timeData.endTime = null;
            this.timeData.startTimeExt1 = null;
            this.timeData.endTimeExt1 = null;
            this.timeData.startTimeExt2 = null;
            this.timeData.endTimeExt2 = null;
            this.timeData.startTimeExt3 = null;
            this.timeData.endTimeExt3 = null;
            this.timeData.startTimeExt4 = null;
            this.timeData.endTimeExt4 = null;
            this.timeData.startTimeExt5 = null;
            this.timeData.endTimeExt5 = null;
            this.timeData.endDate = "2050-01-01";
            this.form.resetFields();
          }
        }
      // if (this.paramsValue.timeIndex == "") {
      //   return this.$message.warning("时段编号不能为空");
      // }
      // if (this.paramsValue.timeName == "") {
      //   return this.$message.warning("时段名称不能为空");
      // }

      console.log(this.paramsValue);
    },
    isTrue(str) {
      return this.parms.indexOf(str) !== -1;
    },
    onShowSizeChange(page, limit) {
      this.forminitial.page = page;
      this.forminitial.limit = limit;
      this.getTimeScheme();
    },
    Pages(page, pageSize) {
      this.forminitial.limit = pageSize;
      this.forminitial.page = page;
      this.forminitial.start = (page - 1) * pageSize;
      this.getTimeScheme();
    },
    delOk() {
      deleteTimeZone({timeIndex: this.selectedRowKeysList.join(",")})
          .then((res) => {
            if (res.data.success == true) {
              this.$message.success(res.data.msg);
              this.selectedRowKeysList = [];
              this.getTimeScheme();
            } else {
              this.$message.warning(res.data.msg);
            }
          })
          .catch((err) => {
            this.$message.error("操作失败");
          });
      this.$refs.delshow.visible = false;
    },
    onSelectChange(e) {
      this.selectedRowKeysList = e;
      console.log(this.selectedRowKeysList);

    },
    edit() {
      setTimeout(() => {
        this.form.setFieldsValue({
          timeIndex:this.data[0].timeIndex,
          timeName:this.data[0].timeName,
        })
      }, 200);

      if (this.selectedRowKeysList.length <= 0)
        return this.$message.warning("请选择时段方案");
      if (this.selectedRowKeysList.length > 1)
        return this.$message.warning("时段方案只能选择一条");
      this.flag = false;
      this.visible = true;
      let editItem = this.data.filter((item) => {
        return item.timeIndex == this.selectedRowKeysList[0];
      });
      console.log(editItem[0].endDate);
      this.timeData.endDate = this.$moment(editItem[0].endDate).format(
          "YYYY-MM-DD"
      );
      this.paramsValue.endDate = this.$moment(editItem[0].endDate).format(
          "YYYY-MM-DD"
      );
      this.paramsId = editItem[0].id;
      this.timeData.timeIndex = editItem[0].timeIndex;
      this.paramsValue.timeIndex = editItem[0].timeIndex;
      this.timeData.timeName = editItem[0].timeName;
      this.paramsValue.timeName = editItem[0].timeName;
      if (editItem[0].startTime) {
        this.timeData.startTime = this.$moment(
            editItem[0].startTime,
            "HH:mm:ss"
        );
        this.paramsValue.startTime = editItem[0].startTime;
      }
      if (editItem[0].endTime) {
        this.timeData.endTime = this.$moment(editItem[0].endTime, "HH:mm:ss");
        this.paramsValue.endTime = editItem[0].endTime;
      }

      if (editItem[0].startTimeExt1) {
        this.timeData.startTimeExt1 = this.$moment(
            editItem[0].startTimeExt1,
            "HH:mm:ss"
        );
        this.paramsValue.startTimeExt1 = editItem[0].startTimeExt1;
      }
      if (editItem[0].endTimeExt1) {
        this.timeData.endTimeExt1 = this.$moment(
            editItem[0].endTimeExt1,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt1 = editItem[0].endTimeExt1;
      }
      if (editItem[0].startTimeExt2) {
        this.timeData.startTimeExt2 = this.$moment(
            editItem[0].startTimeExt2,
            "HH:mm:ss"
        );
        this.paramsValue.startTimeExt2 = editItem[0].startTimeExt2;
      }
      if (editItem[0].endTimeExt2) {
        this.timeData.endTimeExt2 = this.$moment(
            editItem[0].endTimeExt2,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt2 = editItem[0].endTimeExt2;
      }
      if (editItem[0].startTimeExt3) {
        this.timeData.startTimeExt3 = this.$moment(
            editItem[0].startTimeExt3,
            "HH:mm:ss"
        );
        this.paramsValue.startTimeExt3 = editItem[0].startTimeExt3;
      }
      if (editItem[0].endTimeExt3) {
        this.timeData.endTimeExt3 = this.$moment(
            editItem[0].endTimeExt3,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt3 = editItem[0].endTimeExt3;
      }
      if (editItem[0].startTimeExt4) {
        this.timeData.startTimeExt4 = this.$moment(
            editItem[0].startTimeExt4,
            "HH:mm:ss"
        );
        this.paramsValue.startTimeExt4 = editItem[0].startTimeExt4;
      }
      if (editItem[0].endTimeExt4) {
        this.timeData.endTimeExt4 = this.$moment(
            editItem[0].endTimeExt4,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt4 = editItem[0].endTimeExt4;
      }
      if (editItem[0].startTimeExt5) {
        this.timeData.startTimeExt5 = this.$moment(
            editItem[0].startTimeExt5,
            "HH:mm:ss"
        );
        this.paramsValue.startTimeExt5 = editItem[0].startTimeExt5;
      }
      if (editItem[0].endTimeExt6) {
        this.timeData.endTimeExt6 = this.$moment(
            editItem[0].endTimeExt6,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt6 = editItem[0].endTimeExt6;
      }
      if (editItem[0].endTimeExt7) {
        this.timeData.endTimeExt7 = this.$moment(
            editItem[0].endTimeExt7,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt7 = editItem[0].endTimeExt7;
      }
      if (editItem[0].endTimeExt8) {
        this.timeData.endTimeExt8 = this.$moment(
            editItem[0].endTimeExt8,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt8 = editItem[0].endTimeExt8;
      }
      if (editItem[0].endTimeExt9) {
        this.timeData.endTimeExt9 = this.$moment(
            editItem[0].endTimeExt9,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt9 = editItem[0].endTimeExt9;
      }
      if (editItem[0].endTimeExt10) {
        this.timeData.endTimeExt10 = this.$moment(
            editItem[0].endTimeExt10,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt10 = editItem[0].endTimeExt10;
      }
      if (editItem[0].endTimeExt11) {
        this.timeData.endTimeExt11 = this.$moment(
            editItem[0].endTimeExt11,
            "HH:mm:ss"
        );
        this.paramsValue.endTimeExt11 = editItem[0].endTimeExt11;
      }
      this.paramsId = editItem[0].id;
      console.log(editItem[0]);

      this.paramsValue.timeIndex =  editItem[0].timeIndex
      this.paramsValue.timeName = editItem[0].timeName
      console.log(this.paramsValue.timeIndex)
      console.log(this.paramsValue.timeName)
    },
    del() {
      if (this.selectedRowKeysList.length <= 0)
        return this.$message.warning("清选择时段方案");
      this.$refs.delshow.visible = true;
    },
    handleCancel() {
      this.visible = false;
      this.timeData.startTime = this.$moment("", "HH:mm:ss");
      this.timeData.startTime = null;
      this.timeData.endTime = null;
      this.timeData.startTimeExt1 = null;
      this.timeData.endTimeExt1 = null;
      this.timeData.startTimeExt2 = null;
      this.timeData.endTimeExt2 = null;
      this.timeData.startTimeExt3 = null;
      this.timeData.endTimeExt3 = null;
      this.timeData.startTimeExt4 = null;
      this.timeData.endTimeExt4 = null;
      this.timeData.startTimeExt5 = null;
      this.timeData.endTimeExt5 = null;
      this.timeData.endDate = "2050-01-01";
      this.form.resetFields();
    },
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        if (!err) {
          let paramsValue = {};
          paramsValue.timeIndex = values.timeIndex;
          paramsValue.timeName = values.timeName;
          if (values.week1 == true) {
            paramsValue.week1 = 1;
          } else {
            paramsValue.week1 = 0;
          }
          if (values.week2 == true) {
            paramsValue.week2 = 1;
          } else {
            paramsValue.week2 = 0;
          }
          if (values.week3 == true) {
            paramsValue.week3 = 1;
          } else {
            paramsValue.week3 = 0;
          }
          if (values.week4 == true) {
            paramsValue.week4 = 1;
          } else {
            paramsValue.week4 = 0;
          }
          if (values.week5 == true) {
            paramsValue.week5 = 1;
          } else {
            paramsValue.week5 = 0;
          }
          if (values.week6 == true) {
            paramsValue.week6 = 1;
          } else {
            paramsValue.week6 = 0;
          }
          if (values.week0 == true) {
            paramsValue.week0 = 1;
          } else {
            paramsValue.week0 = 0;
          }

          paramsValue.endDate = this.$moment(values.endDate).format(
              "YYYY-MM-DD"
          );
          console.log(paramsValue);
          console.log(values);
          if (TimeInterval(values, paramsValue) == false) return;

          if (this.flag == false) {
            saveTimeZone({...paramsValue})
                .then((res) => {
                  if (res.data.success == true) {
                    this.$message.success("添加成功");
                    this.getTimeScheme();
                  }
                  if (res.data.success == false) {
                    this.$message.warning(res.data.msg);
                  }
                })
                .catch((err) => {
                  this.$message.error("操作失败");
                  console.log(err);
                });
          }
          if (this.flag == true) {
            let demo = this.data.filter((item) => {
              return this.selectedRowKeysList[0] == item.timeIndex;
            });
            paramsValue.id = demo[0].id;
            // console.log(demo)
            updateTimeZone({...paramsValue})
                .then((res) => {
                  if (res.data.success == true) {
                    this.$message.success(res.data.msg);
                    this.getTimeScheme();
                  }
                  if (res.data.success == false) {
                    this.$message.warning(res.data.msg);
                  }
                })
                .catch((err) => {
                  this.$message.error("操作失败");
                  console.log(err);
                });
          }

          this.visible = false;
        }
      });
    },
    add() {
      setTimeout(() => {
        this.form.setFieldsValue({
          timeIndex:"",
          timeName:"",
          endTime:"",
          startTime:""
        })
      }, 200);
      this.flag = true;
      this.visible = true;
      this.paramsValue.timeIndex = "";
      this.paramsValue.timeName = "";
      this.form.setFieldsValue({
        week0: true,
      });
    },
    getTimeScheme() {
      getTimeZoneList({params: this.forminitial})
          .then((res) => {
            this.total = res.data.total;
            res.data.data.forEach((item) => {
              let weekDayList = [];
              if (item.weekValue) {
                if (JSON.parse(item.weekValue).w0 == 1) {
                  weekDayList.push("周日");
                }
                if (JSON.parse(item.weekValue).w1 == 1) {
                  weekDayList.push("周一");
                }
                if (JSON.parse(item.weekValue).w2 == 1) {
                  weekDayList.push("周二");
                }
                if (JSON.parse(item.weekValue).w3 == 1) {
                  weekDayList.push("周三");
                }
                if (JSON.parse(item.weekValue).w4 == 1) {
                  weekDayList.push("周四");
                }
                if (JSON.parse(item.weekValue).w5 == 1) {
                  weekDayList.push("周五");
                }
                if (JSON.parse(item.weekValue).w6 == 1) {
                  weekDayList.push("周六");
                }
                item.weekValue = weekDayList.join(" ");
              }
            });
            this.data = res.data.data;
            console.log(res.data.data);
          })
          .catch((err) => {
            console.log(err);
          });
    },
    onSearch() {
      this.getTimeScheme();
    },
  },
};
</script>

<style lang="scss" scoped>
.ant-table-tbody > tr > td {
  padding: 16px 16px;
  word-break: break-word;
}

/deep/ .ant-form-item-control-wrapper {
  width: 100%;
}

/deep/ .ant-col-12 {
  width: 50% !important;
}

/deep/ .ant-form-item-control {
  width: 518px;
  padding-left: 23px;
}
</style>
